<template>
  <t-dialog :header="header" :confirmBtn="null" :visible.sync="visible" :onClose="closeDialog"
            :closeOnOverlayClick="false"
            width="80%" top="5%">
    <div style="height: 65vh">
      <t-button @click="exportExcel" variant="outline" theme="primary">
            <t-icon name="download" slot="icon"/>
            导出
          </t-button>
      <t-table row-key="id" :columns="columns" :data="data"
               :loading="dataLoading">
        <template #[`projectName`]="{ row }">
          <t-link v-if="row.version === '2024'" @click="dialog.objId=row.id;dialog.header=row.projectName;dialog.open_item_detail=true"
                  hover="color" theme="primary">{{ row.projectName }}
          </t-link>
          <t-link v-else @click="dialog.objId=row.id;dialog.header=row.projectName;dialog.open_detail=true"
                  hover="color" theme="primary">{{ row.projectName }}
          </t-link>
        </template>
        <template #[`adviceFunding`]="{row}">
          {{ row.adviceFunding }}万元
        </template>
        <template #[`subsidyFunding`]="{row}">
          {{ row.subsidyFunding }}万元
        </template>
        <template #[`subjectClassification`]="{row}">
          {{ row.subjectClassification | filterByDict(dict.type.subject_classification) }}
        </template>
        <template #[`projectType`]="{row}">
          {{ row.projectType | filterByDict(dict.type.project_type) }}
        </template>
        <template #[`xsReviewStatus`]="{ row }">
          <t-tag v-if="row.xsReviewStatus"
                 @click="dialog.header=row.projectName;dialog.objId=row.id;dialog.open_approve_list=true"
                 class="cursor-pointer" :theme="handleTheme(row.xsReviewStatus, dict.type.xs_review_status)"
                 variant="light">
            {{ row.xsReviewStatus | filterByDict(dict.type.xs_review_status) }}
          </t-tag>
          <t-tag @click="dialog.header=row.projectName;dialog.objId=row.id;dialog.open_approve_list=true"
                 class="cursor-pointer" v-else theme="warning" variant="light">未评审
          </t-tag>
        </template>
        <template #op="{row}">
          <t-button
            @click="dialog.header=row.projectName;dialog.objId=row.id;dialog.editOpen=false;dialog.open_detail=true"
            size="small" variant="text" class="t-button-link">
            <t-icon name="info-circle" slot="icon"/>
            详情
          </t-button>
        </template>
      </t-table>
      <project-detail-dialog :header="dialog.header" :objId="dialog.objId" :visible.sync="dialog.open_detail"
                             v-if="dialog.open_detail"></project-detail-dialog>
      <item-detail-dialog :header="dialog.header" :objId="dialog.objId" :visible.sync="dialog.open_item_detail"
                             v-if="dialog.open_item_detail"></item-detail-dialog>
      <approve-list :header="dialog.header" :objId="dialog.objId" :visible.sync="dialog.open_approve_list"
                    v-if="dialog.open_approve_list"></approve-list>
    </div>
  </t-dialog>
</template>

<script>
import ApproveList from "./approve-list.vue";
import ProjectDetailDialog from "../../pm/components/project-detail-dialog.vue";
import ItemDetailDialog from "../../pm/components/item-detail-dialog.vue";

export default {
  name: "show-approver-project",
  dicts: ["subject_classification", "project_type", "xs_review_status"],
  components: {
    ApproveList,
    ProjectDetailDialog,
    ItemDetailDialog
  },
  props: ["userId","header"],
  data() {
    return {
      visible: true,
      dataLoading: false,
      data: [],
      dialog: {
        header: "",
        objId: 0,
        open_detail: false,
        editOpen: true,
        open_approve_list: false,
        open_item_detail: false,
      },
      columns: [
        {
          colKey: "projectName",
          title: "项目名称",
          align: "center",
          width: 220
        },
        {
          colKey: "declareDate",
          title: "申报日期",
          align: "center",
          width: 120,
          sorter: true,
        },
        {
          colKey: "projectLeaderName",
          title: "负责人",
          align: "center",
          width: 100
        },
        {
          colKey: "declareDeptName",
          title: "承担单位",
          align: "center",
          width: 180,
          sorter: true,
        },
        {
          colKey: "projectCategoryName",
          title: "计划类别",
          align: "center",
          width: 120
        },
        {
          colKey: "subjectClassification",
          title: "学科分类",
          align: "center",
          width: 100
        },
        {
          colKey: "projectType",
          title: "项目类型",
          align: "center",
          width: 120
        },
        {
          colKey: "startDate",
          title: "开始时间",
          align: "center",
          width: 120,
          sorter: true,
        },
        {
          colKey: "endDate",
          title: "结束时间",
          align: "center",
          width: 120,
          sorter: true,
        },
        {
          colKey: "xsReviewStatus",
          title: "形式审查状态",
          align: "center",
          width: 120,
          fixed: 'right',
          // sorter: true
        },
      ],
    }
  },
  created() {
    this.getList()
  },
  methods: {
    exportExcel(){
      this.$download(`/kjxm/excel/xsReview/getByUserId/${this.userId}`, {}, `项目列表_${new Date().getTime()}.xls`)
    },
    getList() {
      this.dataLoading = true;
      this.$api.kjxm.approve.getApproverReviewByUserId(this.userId).then((res) => {
        this.data = res.data;
        this.dataLoading = false;
      }).catch((e) => {
        this.dataLoading = false
        this.$message.error(e.toString());
      });
    },
    closeDialog() {
      this.$emit("update:visible", false);
    },
  }
}
</script>

<style scoped>

</style>
